www.gusucode.com > 带动画效果的Ajax html5表单源码程序 > 带动画效果的Ajax html5表单/jqcss3noderegjQuery+CSS3节点接触形式带有UI设计体感的注册表单/jqcss3noderegjQuery+CSS3节点接触形式带有UI设计体感的注册表单/src/stylesheets/themes.css
/* ------ Theme: Aqua ------ */ .njsform.theme-aqua .njsform-header { background: #19bec8; color: #FFF; } .njsform.theme-aqua .njsform-socialbar { background: #15a0a8; border-color: #13939b; } .njsform.theme-aqua #humanQuestionLabel { color: #19bec8; } .njsform.theme-aqua .errorMessage, .njsform.theme-aqua .message.error { color: #2fdbe5; } .njsform.bg-white.theme-aqua .errorMessage, .njsform.bg-white.theme-aqua .message.error { color: #13939b; } .njsform.theme-aqua input[type="text"]:focus, .njsform.theme-aqua input[type="email"]:focus, .njsform.theme-aqua input[type="url"]:focus, .njsform.theme-aqua input[type="tel"]:focus, .njsform.theme-aqua textarea:focus, .njsform.theme-aqua select:focus { border-color: #19bec8; -webkit-box-shadow: 0 0 5px #19bec8; -moz-box-shadow: 0 0 5px #19bec8; box-shadow: 0 0 5px #19bec8; } .njsform.theme-aqua input[type="submit"] { background-color: #16a8b1; border-color: #128a92; } .njsform.theme-aqua .submitWrap input[type="submit"]:hover { background-color: #13939b; border-color: #107d84; } .njsform.theme-aqua .submitWrap input[type="submit"]:active { background-color: #107d84; border-color: #0f7076; outline: none; } /* ------ Theme: Blue ------ */ .njsform.theme-blue .njsform-header { background: #009ac4; color: #FFF; } .njsform.theme-blue .njsform-socialbar { background: #007ea0; border-color: #007291; } .njsform.theme-blue #humanQuestionLabel { color: #009ac4; } .njsform.theme-blue .errorMessage, .njsform.theme-blue .message.error { color: #00c2f7; } .njsform.bg-white.theme-blue .errorMessage, .njsform.bg-white.theme-blue .message.error { color: #007291; } .njsform.theme-blue input[type="text"]:focus, .njsform.theme-blue input[type="email"]:focus, .njsform.theme-blue input[type="url"]:focus, .njsform.theme-blue input[type="tel"]:focus, .njsform.theme-blue textarea:focus, .njsform.theme-blue select:focus { border-color: #009ac4; -webkit-box-shadow: 0 0 5px #009ac4; -moz-box-shadow: 0 0 5px #009ac4; box-shadow: 0 0 5px #009ac4; } .njsform.theme-blue input[type="submit"] { background-color: #0086ab; border-color: #006a87; } .njsform.theme-blue .submitWrap input[type="submit"]:hover { background-color: #007291; border-color: #005e78; } .njsform.theme-blue .submitWrap input[type="submit"]:active { background-color: #005e78; border-color: #005268; outline: none; } /* ------ Theme: green ------ */ .njsform.theme-green .njsform-header { background: #2dcb74; color: #FFF; } .njsform.theme-green .njsform-socialbar { background: #27ae63; border-color: #24a15c; } .njsform.theme-green #humanQuestionLabel { color: #2dcb74; } .njsform.theme-green .errorMessage, .njsform.theme-green .message.error { color: #52d98f; } .njsform.bg-white.theme-green .errorMessage, .njsform.bg-white.theme-green .message.error { color: #24a15c; } .njsform.theme-green input[type="text"]:focus, .njsform.theme-green input[type="email"]:focus, .njsform.theme-green input[type="url"]:focus, .njsform.theme-green input[type="tel"]:focus, .njsform.theme-green textarea:focus, .njsform.theme-green select:focus { border-color: #2dcb74; -webkit-box-shadow: 0 0 5px #2dcb74; -moz-box-shadow: 0 0 5px #2dcb74; box-shadow: 0 0 5px #2dcb74; } .njsform.theme-green input[type="submit"] { background-color: #28b668; border-color: #229957; } .njsform.theme-green .submitWrap input[type="submit"]:hover { background-color: #24a15c; border-color: #1f8c50; } .njsform.theme-green .submitWrap input[type="submit"]:active { background-color: #1f8c50; border-color: #1c8049; outline: none; } /* ------ Theme: Pink ------ */ .njsform.theme-pink .njsform-header { background: #b15299; color: #FFF; } .njsform.theme-pink .njsform-socialbar { background: #9a4585; border-color: #8f417b; } .njsform.theme-pink #humanQuestionLabel { color: #b15299; } .njsform.theme-pink .errorMessage, .njsform.theme-pink .message.error { color: #c175ae; } .njsform.bg-white.theme-pink .errorMessage, .njsform.bg-white.theme-pink .message.error { color: #8f417b; } .njsform.theme-pink input[type="text"]:focus, .njsform.theme-pink input[type="email"]:focus, .njsform.theme-pink input[type="url"]:focus, .njsform.theme-pink input[type="tel"]:focus, .njsform.theme-pink textarea:focus, .njsform.theme-pink select:focus { border-color: #b15299; -webkit-box-shadow: 0 0 5px #b15299; -moz-box-shadow: 0 0 5px #b15299; box-shadow: 0 0 5px #b15299; } .njsform.theme-pink input[type="submit"] { background-color: #a1498b; border-color: #883d75; } .njsform.theme-pink .submitWrap input[type="submit"]:hover { background-color: #8f417b; border-color: #7e396c; } .njsform.theme-pink .submitWrap input[type="submit"]:active { background-color: #7e396c; border-color: #733463; outline: none; } /* ------ Theme: Purple ------ */ .njsform.theme-purple .njsform-header { background: #cb2dab; color: #FFF; } .njsform.theme-purple .njsform-socialbar { background: #ae2792; border-color: #a12488; } .njsform.theme-purple #humanQuestionLabel { color: #cb2dab; } .njsform.theme-purple .errorMessage, .njsform.theme-purple .message.error { color: #d952bd; } .njsform.bg-white.theme-purple .errorMessage, .njsform.bg-white.theme-purple .message.error { color: #a12488; } .njsform.theme-purple input[type="text"]:focus, .njsform.theme-purple input[type="email"]:focus, .njsform.theme-purple input[type="url"]:focus, .njsform.theme-purple input[type="tel"]:focus, .njsform.theme-purple textarea:focus, .njsform.theme-purple select:focus { border-color: #cb2dab; -webkit-box-shadow: 0 0 5px #cb2dab; -moz-box-shadow: 0 0 5px #cb2dab; box-shadow: 0 0 5px #cb2dab; } .njsform.theme-purple input[type="submit"] { background-color: #b62899; border-color: #992281; } .njsform.theme-purple .submitWrap input[type="submit"]:hover { background-color: #a12488; border-color: #8c1f76; } .njsform.theme-purple .submitWrap input[type="submit"]:active { background-color: #8c1f76; border-color: #801c6c; outline: none; } /* ------ Theme: red ------ */ .njsform.theme-red .njsform-header { background: #f18176; color: #FFF; } .njsform.theme-red .njsform-socialbar { background: #ee6356; border-color: #ec5648; } .njsform.theme-red #humanQuestionLabel { color: #f18176; } .njsform.theme-red .errorMessage, .njsform.theme-red .message.error { color: #f6aca4; } .njsform.bg-white.theme-red .errorMessage, .njsform.bg-white.theme-red .message.error { color: #ec5648; } .njsform.theme-red input[type="text"]:focus, .njsform.theme-red input[type="email"]:focus, .njsform.theme-red input[type="url"]:focus, .njsform.theme-red input[type="tel"]:focus, .njsform.theme-red textarea:focus, .njsform.theme-red select:focus { border-color: #f18176; -webkit-box-shadow: 0 0 5px #f18176; -moz-box-shadow: 0 0 5px #f18176; box-shadow: 0 0 5px #f18176; } .njsform.theme-red input[type="submit"] { background-color: #ef6c5f; border-color: #eb4e3e; } .njsform.theme-red .submitWrap input[type="submit"]:hover { background-color: #ec5648; border-color: #ea4131; } .njsform.theme-red .submitWrap input[type="submit"]:active { background-color: #ea4131; border-color: #e83423; outline: none; } /* ------ Theme: yellow ------ */ .njsform.theme-yellow .njsform-header { background: #ffb518; color: #FFF; } .njsform.theme-yellow .njsform-socialbar { background: #f3a500; border-color: #e49b00; } .njsform.theme-yellow #humanQuestionLabel { color: #ffb518; } .njsform.theme-yellow .errorMessage, .njsform.theme-yellow .message.error { color: #ffc54b; } .njsform.bg-white.theme-yellow .errorMessage, .njsform.bg-white.theme-yellow .message.error { color: #e49b00; } .njsform.theme-yellow input[type="text"]:focus, .njsform.theme-yellow input[type="email"]:focus, .njsform.theme-yellow input[type="url"]:focus, .njsform.theme-yellow input[type="tel"]:focus, .njsform.theme-yellow textarea:focus, .njsform.theme-yellow select:focus { border-color: #ffb518; -webkit-box-shadow: 0 0 5px #ffb518; -moz-box-shadow: 0 0 5px #ffb518; box-shadow: 0 0 5px #ffb518; } .njsform.theme-yellow input[type="submit"] { background-color: #feac00; border-color: #da9400; } .njsform.theme-yellow .submitWrap input[type="submit"]:hover { background-color: #e49b00; border-color: #cb8a00; } .njsform.theme-yellow .submitWrap input[type="submit"]:active { background-color: #cb8a00; border-color: #bb7f00; outline: none; }